{% extends "base.html" %}

{% block container %}
<main id="alert-container" class="bg-white bg-cover" style="background-image: url(/static/image/login.png);">
    {% if error %}
    <div class="alert alert-dismissible alert-danger" id="alert" role="alert">
        <p class="mb-0">{{ error }}</p>
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">×</span>
        </button>
    </div>
    {% endif %}
    <div class="d-flex align-items-center mx-auto vertical-form">
        <div class="container">
            <div class="card bg-tranparent">
                <div class="card-body p-2 ">
                    <form method="POST" action>
                        <h1 class="text-white">义工管理系统</h1>
                        <div class="input-group mb-3 mt-3 bg-white">
                            <i class="ti-user"></i>
                            <input class="form-control form-control-lg" for="id" name="id" id="id" type="text" placeholder="用户ID">
                        </div>
                        <div class="input-group mb-3 bg-white">
                            <i class="ti-lock"></i>
                            <input class="form-control form-control-lg" for="pwd" name="pwd" id="pwd" type="password" placeholder="密码">
                        </div>
                        <input class="btn btn-block btn-lg btn-primary mt-2" type="submit" value="登录"></a>
                    </form>
                </div>
            </div>
        </div>            
    </div>
</main>
{% endblock %}
